import React from "react";
import { WapHomeO, AppsO, CartO, UserCircleO } from "@react-vant/icons";
import { Navigate } from "react-router-dom";
const Home = React.lazy(() => import("../views/home"));
const Classify = React.lazy(() => import("../views/classify"));
const ShopCar = React.lazy(() => import("../views/shopCar"));
const My = React.lazy(() => import("../views/my"));

const MainLayout = React.lazy(() => import("../views/mainLayout"));
const Search = React.lazy(() => import("../views/search"));
const Detail = React.lazy(() => import("../views/detail"));
const Order = React.lazy(() => import("../views/order"));
const PayResult = React.lazy(() => import("../views/payResult"));

export const mainLayoutChildren = [
  {
    path: "/home",
    element: <Home></Home>,
    title: "首页",
    icon: <WapHomeO />,
  },
  {
    path: "/classify",
    element: <Classify></Classify>,
    title: "分类",
    icon: <AppsO />,
  },
  {
    path: "/shopcar",
    element: <ShopCar></ShopCar>,
    title: "购物车",
    icon: <CartO />,
  },
  {
    path: "/my",
    element: <My></My>,
    title: "我的",
    icon: <UserCircleO />,
  },
  {
    path: "/",
    element: <Navigate to="/home"></Navigate>,
    hidden: true,
  },
];

const routes = [
  {
    path: "/",
    element: <MainLayout></MainLayout>,
    children: mainLayoutChildren,
  },
  {
    path: "/search",
    element: <Search></Search>,
  },
  {
    path: "/post/:id",
    element: <Detail></Detail>,
  },
  {
    path: "/order/",
    element: <Order></Order>,
  },
  {
    path: '/pay/result',
    element: <PayResult></PayResult>
  }
];

export default routes;
